import 'package:flutter/material.dart';

import '../constants.dart';

class NavigationPanel extends StatelessWidget {
  const NavigationPanel();
  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.symmetric(vertical: 8, horizontal: margin10),
      padding: EdgeInsets.fromLTRB(8, 8, 8, 8),
      decoration: BoxDecoration(
          color: Colors.white, borderRadius: BorderRadius.circular(10)),
      child: Column(
        children: [
          Row(
            children: [
              menuItem("assets/1.png", "美食"),
              menuItem("assets/2.png", "甜食饮品"),
              menuItem("assets/3.png", "超市便利"),
              menuItem("assets/4.png", "蔬菜水果"),
              menuItem("assets/5.png", "买药"),
            ],
          ),
          Row(
            children: [
              smallMenuItem("assets/1_9.png", "品质午餐"),
              smallMenuItem("assets/1_2.png", "汉堡披萨"),
              smallMenuItem("assets/1_3.png", "日韩料理"),
              smallMenuItem("assets/1_8.png", "快食简餐"),
              smallMenuItem("assets/1_5.png", "凉皮肉夹馍"),
            ],
          ),
          Row(
            children: [
              smallMenuItem("assets/1_6.png", "饺子馆"),
              smallMenuItem("assets/1_7.png", "家常菜"),
              smallMenuItem("assets/1_10.png", "超值联盟"),
              smallMenuItem("assets/1_1.png", "美团转送"),
              smallMenuItem("assets/1_4.png", "全部分类"),
            ],
          )
        ],
      ),
    );
  }
  Widget menuItem(String imageAsset, String title) {
    return Expanded(
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Column(
          children: [
            Image.asset(imageAsset),
            Padding(
              padding: const EdgeInsets.only(top: 6),
              child: Text(
                title,
                style: TextStyle(
                  fontSize: 12,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget smallMenuItem(String imageAsset, String title) {
    return Expanded(
      child: Padding(
        padding: const EdgeInsets.symmetric(vertical: 8.0),
        child: Column(
          children: [
            Image.asset(
              imageAsset,
              width: 20,
              height: 20,
            ),
            Padding(
              padding: const EdgeInsets.only(top: 6),
              child: Text(
                title,
                style: TextStyle(fontSize: 12),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
